{include file="public/nheader" /}
<style>
    .exception {
        margin: 150px 0;
        text-align: center;
    }

    .exception .exception-img {
        margin: 15px 30px;
        display: inline-block;
        vertical-align: middle;
    }

    .exception .exception-text {
        margin: 15px 30px;
        display: inline-block;
        vertical-align: middle;
    }

    .exception:not(.exception-dark) .exception-content>h1,
    .exception-content>p {
        color: #515a6e;
    }

    .exception .exception-content>h1 {
        font-size: 72px;
        font-weight: 600;
        margin: 0 0 20px 0;
    }

    .exception .exception-content>p {
        font-size: 20px;
        margin: 0 0 25px 0;
        color: #808695;
    }
</style>
{if !empty($row)}
<div class="layui-fluid layui-bg-white">
    <div id="ordrss">
        <div class="layui-form-item" style="width: 100%;overflow-x:scroll">
            <table class="layui-table layui-form">
                <thead>
                    <tr>
                        <th>产品</th>
                        <th>图片</th>
                        <th>单价</th>
                        <th>件数</th>
                    </tr>
                </thead>
                <tbody>
                    {foreach $row.product as $v}
                    <tr>
                        <td>{$v.title|default=''}</td>
                        <td><img style="height:50px" src="{$v.images}" lay-image-click=""></td>
                        <td>{$v.price|default=''}</td>
                        <td>{$v.number|default=''}</td>
                    </tr>
                    {/foreach}
                </tbody>
            </table>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">品牌:</label>
            <div class="layui-form-label" style="text-align: left;color:#1E9FFF;width:auto">
                {$row.agent_name.nickname|default=''}
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">订单编号:</label>
            <div class="layui-form-label" style="text-align: left;color:#1E9FFF;width:auto">
                {$row.ordersn|default='0'}
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">用户信息:</label>
            <div class="layui-form-label" style="text-align: left;color:#1E9FFF;width:auto">
                {$row.name|default='0'} {$row.mobile|default='0'}
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">收货地址:</label>
            <div class="layui-form-label" style="text-align: left;color:#1E9FFF;width:auto">
                {$row.province_text|default=''}/{$row.city_text|default=''}/{$row.area_text|default=''}/{$row.street_text|default=''}/{$row.address|default='0'}
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">用户备注:</label>
            <div class="layui-form-label" style="text-align: left;color:#1E9FFF;width:auto">
                {$row.info|default='无'}
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">订单状态:</label>
            <div class="layui-form-label" style="text-align: left;color:#1E9FFF;width:auto">
                {$row.status_text|default='0'}
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">金额:</label>
            <div class="layui-form-label" style="text-align: left;color:#1E9FFF;width:auto">
                {$row.total|default='0'}元
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">下单时间:</label>
            <div class="layui-form-label" style="text-align: left;color:#1E9FFF;width:auto">
                {$row.created|default='无'}<br />
            </div>
        </div>
    </div>
    <button class="layui-btn icon-btn" onclick="doPrint()">打印货单</button>
    {else}
    <div class="exception">
        <div class="exception-text">
            <div class="exception-content">
                <p>抱歉，订单不存在</p>
            </div>
        </div>
    </div>
    {/if}
</div>
{include file="public/nfooter" /}
<script>
    function doPrint() {
        var head_str = '<html><head><title></title><meta name="renderer" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"></head><body>'; //先生成头部
        var foot_str = "</body></html>"; //生成尾部
        var older = document.body.innerHTML;
        var new_str = document.getElementById('ordrss').innerHTML; //获取指定打印区域
        var old_str = document.body.innerHTML; //获得原本页面的代码
        document.body.innerHTML = head_str + '<div style="width:100%;margin:auto">' + new_str + '</div>' + foot_str; //构建新网页
        console.log(document.body.innerHTML);
        window.print(); //打印刚才新建的网页
        document.body.innerHTML = older; //将网页还原
        return false;
    }
</script>